let layerIndex;
/**
 * 弹出学生新增/更新对话框
 */
function showStudenDlg(id){

    let title="新增学生"
    if(id){
        //是编辑
        title="编辑学生"
        $("#formId").css("display","block")
        //读取学生信息，并赋值
        $.ajax({
            url:"/api/student/"+id,
            method: "GET"
        }).done(result=>{
            console.log(result)
            console.log("Fetched data:", result); // 检查返回的数据
            //遍历result对象并将值填充到#teacForm表单中
            $.each(result,function (key,value){
                //修改选择器，确保选择的是#teacForm内的字段
                var field=$('#studForm [name="'+key+'"]');
                if(field.is(':radio')){
                    field.filter('[value="'+value+'"]').prop('checked',true);//选中对应的单选按钮
                }else if(field.is(':checkbox')){
                    field.prop('checked',value==="yes");//选中复选框
                }else{
                    field.val(value);//填充文本框或其他字段
                }
                console.log("Field", key, "set to", value); // 调试字段填充
            });
        }).fail(function (jqXHR, textStatus, errorThrown) {
            console.error("Error fetching data:", textStatus, errorThrown);
        });
    }else{
        //是新增,清空表单
        $("#studForm")[0].reset();
        $("#formId").css("display","none")
    }
    layerIndex=layer.open({
        type:1,
        title:title,
        area:['520px','auto'],
        content:$('#studForm')//捕获层
    });
}

function getSearchCondition(){
    let formData={}
    //遍历每个输入元素，将其值储存到formData对象中
    $('#queryForm').find('input,select').each(function (){
        let name=$(this).attr('name');//获取元素的name属性
        let value=$(this).val();//获取元素的值
        //只有name属性存在且值不为空才会添加到formData中
        if(name && value){
            formData[name]=value;
        }
    });
    return formData
}

layui.use(function (){
    //（1）验证表单是否合法
    layui.form.on('submit(stud-dlg)',function (data){
        event.preventDefault();//阻止表单默认提交
        commitStuDlg();
    })
    //(2)表格初始化
    const table=layui.table;
    let student=getSearchCondition();
    //创建渲染实例
    table.render({
        elem:'#tbStudent',
        url:'/api/student/getbypage',//此处为静态模拟数据，实际使用时需换成真实接口
        method:"POST",
        contentType:'application/json',//确保以JSON格式发送
        where:{"data":student},
        page:true,
        cols:[[
            {type:'checkbox',fixed:'left'},
            {field:'id',fixed:'left',width:80,title:'id',sort:true},
            {field: 'name',title:'姓名'},
            {
                field: 'sno',
                title: '学号',
                width: 150,
            },
            {field: 'sex',width: 80,title: '性别',sort: true,
                templet:d => d.sex===1?'男':(d.sex===2?'女':'未知'),
            },
            {field: 'age',width: 100,title: '年龄',sort: true},
            {fixed: 'right',title: '操作',width: 134,minWidth:125,templet:'#editTemplate'}
        ]],
        done:function (rs){

        }
    })
    //触发单元格工具事件
    table.on('tool(tbStudent)',function(obj){
        var data=obj.data;//获得当前行数据
        if(obj.event==='edit'){
            // layer.open({
            //     title:'编辑 - id:'+data.id,
            //     type:1,
            //     area:['80%','80%'],
            //     content:'<div style="padding:16px;">自定义表单元素</div>'
            // });
            showStudenDlg(data.id); // 打开编辑对话框并填充数据
        }
    });
});

function search(){
    let student=getSearchCondition();
    const table=layui.table;
    table.reloadData("tbStudent",{
        where:{data:student}
    });
    console.log("where condition:"+JSON.stringify(student))
}

function commitStuDlg(){
    let id=$("#id").val()
    let formData=$("#studForm").serialize();
    if(id!=null && id!=""){
        //更新教师
        $.ajax({
            url:"/api/student/update",
            method:"PUT",
            data:formData
        }).done(result=>{
            console.log(result);
            if(result.id){
                //（4）读取并刷新原来的读学生列表
                loadAllStudents();
                //（3）关闭弹出层
                console.log("add success!")
                if(layerIndex)
                    layer.close(layerIndex)

            }
        }).fail((jqXHR,textStatus,errorThrown)=>{
            console.error("Request failed:"+textStatus + "-"+errorThrown);
            //可以在这里处理错误逻辑
            alert("An error occurred.Please try again.");
        });
    }else{
        //新增学生需要进行

        //（2）将表单数据发送到服务器的insert中，把提交按钮变灰
        let formData=$("#studForm").serialize();
        $.ajax({
            url:"/api/student/add",
            method:"POST",
            data:formData
        }).done(result=>{
            console.log(result);
            if(result.id){
                //（4）读取并刷新原来的读学生列表
                loadAllStudents();
                //（3）关闭弹出层
                console.log("add success!")
                if(layerIndex)
                    layer.close(layerIndex)

            }
        }).fail((jqXHR,textStatus,errorThrown)=>{
            console.error("Request failed:"+textStatus + "-"+errorThrown);
            //可以在这里处理错误逻辑
            alert("An error occurred.Please try again.");
        });
    }

    $("#btnok").prop("disabled",true).addClass("layui-btn-disabled");//禁用按钮

}
function deleteConfirm(){
    const table = layui.table;
    // 获取选中的记录
    const checkStatus = table.checkStatus('tbStudent');
    console.log(checkStatus);
    const selectedRows = checkStatus.data;
    if (selectedRows.length === 0) {
        layer.msg('请至少选择一条记录');
        return;
    }
    layer.confirm('确定要删除选中的学生记录吗？', { icon: 3, title: '删除确认' }, function () {
        // 提取 id 并合并成字符串
        const ids = selectedRows.map(row => row.id);
        $.ajax({
            url: '/api/student/deleteMultiple',
            method: "DELETE",
            contentType: 'application/json',
            data:JSON.stringify(ids),
            success: function (result) {
                layer.msg("删除成功");
                showTable();  // 删除成功后重新加载数据
            },
            error: function () {
                layer.msg('删除失败，请稍后再试');
            }
        });
        layer.closeAll();  // 关闭弹出层
    });
}
function showTable(){
    const table=layui.table;
    let student=getSearchCondition();
    //创建渲染实例
    table.render({
        elem:'#tbStudent',
        url:'/api/student/getbypage',
        method:"POST",
        contentType:'application/json',
        where:{"data":student},
        page:true,
        cols:[[
            {type:'checkbox',fixed:'left'},
            {field:'id',fixed:'left',width:80,title:'id',sort:true},
            {field:'name',title:'姓名'},
            {
                field: 'sno',
                title:'学号',
                width:150,
            },
            {field: 'sex',width:80,title:'性别',sort:true},
            {field:'age',width:100,title:'年龄',sort:true},
            {fixed:'right',title:'操作',width:134,minWidth:125,templet:'#editTemplate'}
        ]],
        done:function (rs){
        }
    });
}